warm and cool contrast
modern minimalism
emotional depth
day-to-night transition
amber highlights
gray undertones
immersive experience
high readability
functional design
future-forward aesthetics
Shadcn/ui Theme Css Variables
name: Amber Horizonkeyword: one theme based on gray and amber colors views: 4
:root { --background: 95 10% 95%; --foreground: 0 0% 10%; --card: 95 10% 90%; --card-foreground: 0 0% 10%; --popover: 95 10% 90%; --popover-foreground: 0 0% 10%; --primary: 45 100% 50%; --primary-foreground: 0 0% 10%; --secondary: 0 0% 80%; --secondary-foreground: 0 0% 10%; --muted: 0 0% 70%; --muted-foreground: 0 0% 40%; --accent: 30 100% 70%; --accent-foreground: 0 0% 10%; --destructive: 0 100% 50%; --destructive-foreground: 0 0% 100%; --border: 0 0% 80%; --input: 0 0% 80%; --ring: 45 100% 50%; --radius: 0.75rem; --chart-1: 45 100% 50%; --chart-2: 30 100% 70%; --chart-3: 0 0% 80%; --chart-4: 95 10% 90%; --chart-5: 0 0% 10%; } .dark { --background: 0 0% 10%; --foreground: 0 0% 90%; --card: 0 0% 15%; --card-foreground: 0 0% 90%; --popover: 0 0% 15%; --popover-foreground: 0 0% 90%; --primary: 45 100% 50%; --primary-foreground: 0 0% 10%; --secondary: 0 0% 20%; --secondary-foreground: 0 0% 90%; --muted: 0 0% 30%; --muted-foreground: 0 0% 60%; --accent: 30 100% 50%; --accent-foreground: 0 0% 10%; --destructive: 0 100% 50%; --destructive-foreground: 0 0% 100%; --border: 0 0% 20%; --input: 0 0% 20%; --ring: 45 100% 50%; --radius: 0.75rem; --chart-1: 45 100% 50%; --chart-2: 30 100% 50%; --chart-3: 0 0% 20%; --chart-4: 0 0% 15%; --chart-5: 0 0% 90%; }